<template>
	<view class="page">
		<view class="user_Information">
			<span class="h1">联系人信息</span>
			<view class="info">
				<view style="width: 100%;height: 100rpx;">
					<radio-group name="sex" @change="radioChange">
						<label class="left">性别</label>
						<label class="right">
							<radio value="男" color='#1677FF' /><text class="text">男士</text>
							<radio value="女" color='#1677FF' style="margin-left: 10rpx;" /><text class="text">女士</text>
						</label>
					</radio-group>
				</view>
				
				<view class="" style="width: 100%;height: 100rpx;">
					<label class="left">姓名</label>
					<input class="right_inp" v-model="username" type="text" placeholder="请输入姓名" />
				</view>
				<view class="" style="width: 100%;height: 100rpx;">
					<label class="left">年龄</label>
					<input class="right_inp" v-model="age" type="text" placeholder="请输入年龄" />
				</view>
			</view>
			<button type="submit" class="bt_1" @click="inquire">进入咨询</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				sex: '',
				username: '',
				age: null,
			}
		},
		methods: {
			radioChange(e) {
				console.log(e);
				this.sex = e.detail.value
			},
			inquire(){
				console.log(this.sex,this.username,this.age);
				// if(this.sex != '' && this.username != '' && this.age != null) {
				// 	uni.navigateTo({
				// 			url:'/page_zixun/zixun_info/zixun_info'
				// 	})
				// }
				uni.navigateTo({
							url:'/page_zixun/zixun_info/zixun_info'
					})
			}
		}
	}
</script>

<style scoped lang="scss">
	.page {
		width: 100vw;
		height: 100vh;
		position: relative;
		display: flex;
		flex-direction: column;
		background-color: #F0F0F0;

		.user_Information {
			width: 622rpx;
			height: 450rpx;
			background: #FFFFFF;
			border-radius: 8rpx 8rpx 8rpx 8rpx;
			position: absolute;
			top: 25%;
			left: 50%;
			transform: translate(-50%, -50%);

			.h1 {
				display: inline-block;
				font-size: 36rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 600;
				margin-top: 30rpx;
				margin-left: 30rpx;
			}

			.info {
				height: 350rpx;
				width: 100%;
				margin-top: 90rpx;

				.left {
					float: left;
					margin-left: 30rpx;
					font-size: 30rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: bold;
					letter-spacing: 35rpx;
				}

				.right {
					float: right;
					margin-right: 20rpx;
				}
				.text {
					font-size: 28rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight:bold;
					margin: 0rpx 10rpx 0rpx 10rpx;
				}
				.right_inp{
					float: right;
					width: 200rpx;
				}

			}
			.bt_1{
				width: 622rpx;
				height: 98rpx;
				background: #1677FF;
				margin: 150rpx auto  20rpx;
				font-size: 36rpx;
				font-family: Source Sans Pro, Source Sans Pro;
				font-weight: 400;
				color: #FFFFFF;
				line-height: 98rpx;
				border-radius: 84rpx 
			}
		}
	}
</style>